<template>
	<page-card title="请假审批详情">
		<div class="table-page-search-wrapper">
			<a-row type="flex"
						 justify="center">
				<a-col style="font-size:18px;font-weight:800;margin:20px;">
					重庆市公安局xx分局领导外出请假审批表
				</a-col>
			</a-row>
			<a-row type="flex"
						 justify="center">

        <a-col :span="3"
							 class="front">
			    姓名
				</a-col>


				<a-col :span="12"
							 class="value">
          {{leaveInfo.userName}}
				</a-col>
			</a-row>
			<a-row type="flex"
						 justify="center"
						 style="height:80px;">
				<a-col :span="8">
					<a-col>
						<a-col :span="9"
									 class="front">
							单位
						</a-col>
						<a-col :span="15"
									 class="value">
              {{leaveInfo.deptName}}
						</a-col>
					</a-col>
					<a-col>
						<a-col :span="9"
									 class="front">
							职务
						</a-col>
						<a-col :span="15"
									 class="value">
              {{leaveInfo.userRole}}
						</a-col>
					</a-col>

				</a-col>
				<a-col :span="7">

					<a-col :span="7"
								 class="front"
								 style="height:80px;">
						起止时间
					</a-col>

					<a-col :span="17"
								 class="value"
								 style="height:80px;">
            {{leaveInfo.startTime}}-{{leaveInfo.endTime}}
					</a-col>

				</a-col>
			</a-row>
			<a-row type="flex"
						 justify="center">
				<a-col :span="3"
							 class="front"
							 style="height:60px;">
					事由
				</a-col>
				<a-col :span="12"
							 class="value"
							 style="height:60px;">
          {{leaveInfo.leaveReason}}
				</a-col>
			</a-row>
			<a-row type="flex"
						 justify="center">
				<a-col :span="3"
							 class="front">
					主持工作领导
				</a-col>
				<a-col :span="2"
							 class="front">
					姓名
				</a-col>
				<a-col :span="3"
							 class="value">
          {{leaveInfo.leaderId}}
				</a-col>
				<a-col :span="2"
							 class="front">
					职务
				</a-col>
				<a-col :span="5"
							 class="value">
          {{leaveInfo.leaderPostId}}
				</a-col>
			</a-row>
			<a-row type="flex"
						 justify="center">
				<a-col :span="3"
							 class="front"
							 style="height:60px;">
					年内休假情况
				</a-col>
				<a-col :span="12"
							 class="value"
							 style="height:60px;">
          查看该用户相关的请假申请
				</a-col>
			</a-row>
			<a-row type="flex"
						 justify="center">
				<a-col :span="15"
							 style="border:1px solid #aaa;display: flex;justify-content: center;align-items: center;">
					<a-col :span="12"
								 style="margin-bottom:20px">
            <a-col style="color:#0670d1;margin:20px 0;font-size:20px">办理流程</a-col>
						<a-timeline>
							<a-timeline-item>
								<a-icon slot="dot"
												type="check-circle"
												style="font-size: 16px;" />
								<a-row type="flex"
											 justify="space-between">
									<a-col>发起申请</a-col>
									<a-col style="color:#c2c2c2">2021-12-26 20:00</a-col>
								</a-row>
								<a-col style="color:#c2c2c2">我</a-col>
							</a-timeline-item>
							<a-timeline-item>
								<a-icon slot="dot"
												type="check-circle"
												style="font-size: 16px;" />
								<a-row type="flex"
											 justify="space-between">
									<a-col>
										<a-row type="flex">
											<a-col>某某某</a-col>
											<a-col style="color:#0670d1;margin-left:5px">已同意</a-col>
										</a-row>
									</a-col>
									<a-col style="color:#c2c2c2">2021-12-26 20:00</a-col>
								</a-row>
								<a-col style="color:#c2c2c2">拟同意</a-col>
								<a-col>签名：</a-col>
							</a-timeline-item>
							<a-timeline-item>
								<a-icon slot="dot"
												type="check-circle"
												style="font-size: 16px;" />
								<a-row type="flex"
											 justify="space-between">
									<a-col>
										<a-row type="flex">
											<a-col>某某某</a-col>
											<a-col style="color:#ec5555;margin-left:5px">审核中</a-col>
										</a-row>
									</a-col>
									<a-col style="color:#c2c2c2">2021-12-26 20:00</a-col>
								</a-row>
							</a-timeline-item>
						</a-timeline>
					</a-col>
				</a-col>

			</a-row>
			<a-row type="flex"
						 justify="center"
						 style="margin:20px;">
				<a-button type="primary"
									style="margin-right:80px;">
					打印
				</a-button>
				<a-button type="primary">
					返回
				</a-button>
			</a-row>
		</div>
	</page-card>
</template>
<script>
import {leaveInfoList, leaveInfoDel, leaveInfoGetById, leaveInfoSaveOrUpdate} from '@/api/leaveinfo'
import { Timeline } from 'ant-design-vue'
// import {
// 	PAGINATION,
// 	TABLE_STATUS_CELL} from '@zt/zongheng-pro/framework/constants'


export default {
	components: { [Timeline.Item.name]: Timeline.Item },
  data () {
    return {
      leaveInfo:[],
      form: this.$form.createForm(this)
    }
  },
  mounted () {
    const params = this.$route.query
    console.log(params)
    // if (Object.keys(params).length == 0)
    // {
    //   return
    // }

    if (1)
    {
      leaveInfoGetById(1).then(response =>
      {
        console.log(response)
        //this.form.setFieldsValue(response)
        this.leaveInfo=response
      })
    }
  },
  methods: {
    handleSave () {
      this.form.validateFieldsAndScroll((err, values) => {
        if (err) {
          return
        }
        leaveInfoSaveOrUpdate(values).then((response) => {
          this.message.success('保存成功')
          console.log(response.data+'123')
          this.$router.go(-1)
        })
      })
    }
  }

}
</script>
<style>
.front {
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 1px solid #aaa;
}
.value {
	display: flex;
	align-items: center;
	padding-left: 10px;
	border: 1px solid #aaa;
	height: 40px;
}
</style>
